}
// buttons
-.app-view-control {
- padding: $base_padding $base_padding*5;
- margin: 0;
- background-color: transparentize($osd_bg_color, 0.5);
- border-width: 1px;
- color: darken($osd_fg_color, 25%);
+.app-view-control {
- &:hover {
- background-color: transparentize($osd_bg_color, 0.5) !important;
- box-shadow:none !important;
+ padding: 4px 32px;
+ margin: 0 4px;
+ &, &:hover, &:checked {
+ @include button(undecorated);
color: darken($osd_fg_color, 25%);
+ background-color: transparent !important;
+ }
+
+ &:hover {
+ color: $osd_fg_color;
+ box-shadow: inset 0 -2px darken($osd_fg_color, 25%);
}
&:active {
- box-shadow: none;
- background-color: $selected_bg_color !important;
- &:hover {
- background-color: lighten($selected_bg_color, 11%) !important;
- }
+ box-shadow: inset 0 -2px $osd_fg_color;
}
&:checked {
- background-color: $selected_bg_color !important;
- color: $selected_fg_color;
- box-shadow: none;
- &:active { background-color: darken($selected_bg_color, 4%) !important; }
- &:hover { background-color: lighten($selected_bg_color, 7%) !important; }
+ color: $osd_fg_color;
+ box-shadow: inset 0 -2px $selected_bg_color;
}
&:first-child {
- border-right-width: 0 !important;
- border-radius: $base_border_radius 0 0 $base_border_radius;
+ border-right-width: 0;
+ border-radius: 0;
}
&:last-child {
- border-radius: 0 $base_border_radius $base_border_radius 0;
+ border-radius: 0;
}
}